<html>

<head>
    <link rel="stylesheet" href="../normalize.css">
    <link rel="stylesheet" href="../index.css">
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>

<body>

    <div id="app">
    </div>
</body>

<script type="text/javascript">
    //局部注册
    var ComponentA = { /* ... */ }
    var ComponentB = { /* ... */ }
    var ComponentC = { /* ... */ }
    new Vue({
        el: '#app',
        components: {
            'component-a': ComponentA,
            'component-b': ComponentB
        }
    })
    //局部注册的组件在其子组件中不可用,如果你希望 ComponentA 在 ComponentB 中可用。需要这样书写
    var ComponentA = { /* ... */ }

    var ComponentB = {
        components: {
            'component-a': ComponentA
        },
        // ...
    }



</script>

</html>